<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	<style>
		*{
			/*外边距*/
			margin: 0;
			/*内边距*/
			padding: 0;
		}
		
		.left-box{
			width:400px;
			height: 100vh;
			/*background:blue;*/
			position: fixed;
		}
		
		.right-box{
			margin-left: 400px;
			height: 900px;
			background: yellow;
		}
		.ad{
			width: 250px;
			height: 100vh;
			/*background: pink;*/
			float: left;
			
		}
		.ad .ad-one{
			margin-top: 60px;
			height: 260px;
			/*background: pink;*/
			text-align: center;
		}
		.ad .ad-one .small-p{
			width: 200px;
			height: 200px;
			
		}
		.ad .ad-one .detail{
			border-radius: 10px 10px 10px 10px;
			line-height: 40px;
			color: white;
			font-weight: 600;
			margin-top: 10px;
			width: 225px;
			height: 40px;
			background: #00a0f0;
			text-align: center;
		}
		.ad .ad-two{
			margin-top: 60px;
			height: 260px;
			/*background: gold;*/
		}
		.ad .ad-two{
			margin-top: 60px;
			height: 260px;
			/*background: pink;*/
			text-align: center;
		}
		.ad .ad-two .small-o{
			width: 200px;
			height: 200px;
			
		}
		.ad .ad-two .detail2{
			border-radius: 10px 10px 10px 10px;
			line-height: 40px;
			color: white;
			font-weight: 600;
			margin-top: 10px;
			width: 225px;
			height: 40px;
			background: #00a0f0;
			text-align: center;
		}
		.left-list{
			width: 150px;
			height: 100vh;
			background:skyblue;
		    float: left;
		}
	</style>
	</head>
	<body>
		<div class="home">
			<div class="left-box">
				<div class="ad">
				<div class="ad-one">
					<img class="small-p" src="http://www.wwp666.cn/img/wxxcx.49b2bdff.jpg" />
					<div class="detail">前端面试题小程序</div>
				</div>
			
				<div class="ad-two">
					<img class="small-o" src="https://i04piccdn.sogoucdn.com/4991414839b6620e" />
					<div class="detail2">GG爆</div>
				</div>
			
				</div>
				<div class="left-list">
					<ul>
					<li>前端学习文档</li>
					<li>常用的库</li>
					<li>代码托管平台</li>
					<li>工具学习</li>
					<li>面试题网站</li>
					<li>node</li>
					</ul>

				</div>
			</div>
			
			<div class="right-box"></div>
		</div>
	</body>
</html>
